<template>
      <div class="box-title">
          <div class="box-title-left">
           <text class="iconfont icon-31liebiao"></text>
          </div>
          <div class="box-title-center">
              <div @click="toInfo">我的</div>
              <div>发现</div>
              <div>云村</div>
              <div>视频</div>
          </div>
          <router-link to="/search" class="box-title-right">
            <text class="iconfont icon-fangdajing"></text>
          </router-link>
     </div>
</template>

<script>
import {useRouter} from 'vue-router'
export default {
   setup(){
        const router = useRouter()
       function toInfo(){
           router.push('/info')
       }
        return {router,toInfo}
   }


}
</script>

<style lang="less" scoped>
.box-title{
    display: flex;
    justify-content: space-between;
    margin-top:.21rem;

    .box-title-left text{
        font-size:.50rem;
    }
    .box-title-center{
        display:flex;
        width:80%;
        justify-content: space-evenly;

        div{
            // background: red;
            width:6.25rem;
            font-size:.40rem;
            margin-left:12px;
            text-align:center;
        }
        div:nth-child(2){
            font-weight:600;
        }
    }

   .box-title-right text{
        font-size:.50rem;
    }
}
</style>